import React, { useState, useEffect } from 'react'
import style from './Index.module.less'

function getFormatValue (v) {
  const arr = []
  if (v instanceof Array) {
    v.forEach(li => {
      if (li && li.title) {
        arr.push(li.title)
      }
    })
  }
  return arr.join()
}

function Main ({ data }) {
  const [value, setValue] = useState('')
  useEffect(() => {
    if (data.value) {
      setValue(getFormatValue(data.value))
    }
  }, [data])
  return (
    <div className={style.container}>
      <div className={style.label}>{data.title}</div>
      <div className={style.value}>{value || '无'}</div>
    </div>
  )
}

export default Main
